import verification from 'verification-code';
import React from 'react'


export default class VerificationCode extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            imgDataURL: '',
            code: null
        }
    }

    componentDidMount() {
        const result = verification.create();
        this.setState({
            code: result.code,
            imgDataURL: result.dataURL
        })

        this.props.currentCode && this.props.currentCode(result.code)
    }

    handleChangeCode() {
        const result = verification.create();
        this.setState({
            code: result.code,
            imgDataURL: result.dataURL
        })
        this.props.currentCode && this.props.currentCode(result.code)
    }

    render() {

        const {width, height} = this.props

        return (
            <img src={this.state.imgDataURL}
                 style={{width: width || 'auto', height: height || 'auto'}}
                 onClick={this.handleChangeCode.bind(this)}
            />
        )
    }
}
